<%@page import="itpenguin.review.entities.Item"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<fmt:setLocale value="ja-JP" />
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<c:if test="${isMobile}">
<link href="/css/mobile.css" rel="stylesheet" type="text/css"/>
</c:if>
<c:if test="${! isMobile}">
<link href="/css/pc.css" rel="stylesheet" type="text/css"/>
</c:if>

<c:choose>
	<c:when test="${! empty item}">
		<title>レビュー・ペンギン : ${item.reviewTitle}</title>
		<c:if test="${item.productGroup == 'Book'}">
			<meta name="Keywords" content="レビュー, 本, <c:forEach var="author" items="${item.authors}">${author}, </c:forEach>${item.reviewTitle}" />
			<meta name="description" content="書名:${item.title}, 著者:<c:forEach var="author" items="${item.authors}">${author} </c:forEach> のレビューです。" />
		</c:if>
		<c:if test="${item.productGroup == 'Visual'}">
			<meta name="Keywords" content="レビュー, <c:forEach var="director" items="${item.directors}">${director}, </c:forEach><c:forEach var="actor" items="${item.actors}">${actor}, </c:forEach>${item.reviewTitle}" />
			<meta name="description" content="作品名:${item.reviewTitle}, 監督:<c:forEach var="director" items="${item.directors}">${director} </c:forEach>, 出演:<c:forEach var="actor" items="${item.actors}">${actor} </c:forEach> のレビューです。" />
		</c:if>
		<c:if test="${item.productGroup == 'Music'}">
			<meta name="Keywords" content="レビュー, 音楽, <c:forEach var="artist" items="${item.artists}">${artist}, </c:forEach>${item.title}" />
			<meta name="description" content="タイトル:${item.title}, アーティスト:<c:forEach var="artist" items="${item.artists}">${artist} </c:forEach> のレビューです。" />
		</c:if>
		<c:if test="${item.productGroup == 'Game'}">
			<meta name="Keywords" content="レビュー, ゲーム, ${item.platform}, ${item.reviewTitle}" />
			<meta name="description" content="タイトル:${item.reviewTitle}, プラットフォーム:${item.platform} のレビューです。" />
		</c:if>
	</c:when>
	<c:when test="${! empty rating}">
		<title>レビュー・ペンギン : Rating [<c:if test="${rating != 0}">${(rating - 1)*20 + 1}点～</c:if>${rating*20}点] （新着順）</title>
		<meta name="Keywords" content="レビュー, 採点" />
	</c:when>
	<c:when test="${! empty beginDate}">
		<c:if test="${range == 1}">
			<title>レビュー・ペンギン : <fmt:formatDate value="${beginDate}" pattern="yyyy年M月" timeZone="JST"/>のレビュー (新着順)</title>
		</c:if>
		<c:if test="${range == 12}">
			<title>レビュー・ペンギン : <fmt:formatDate value="${beginDate}" pattern="yyyy年" timeZone="JST"/>のレビュー (新着順)</title>
		</c:if>
		<meta name="Keywords" content="レビュー" />
	</c:when>
	<c:when test="${! empty year}">
		<title>レビュー・ペンギン :  直近1年間のランキング</title>
		<meta name="Keywords" content="レビュー, ランキング" />
	</c:when>
	<c:when test="${! empty all}">
		<title>レビュー・ペンギン :  全期間のランキング</title>
		<meta name="Keywords" content="レビュー, ランキング" />
	</c:when>
	<c:when test="${! empty search}">
		<title>レビュー・ペンギン : サイト内検索</title>
	</c:when>
	<c:otherwise>
		<title>レビュー・ペンギン</title>
		<meta name="Keywords" content="レビュー,本,映画,音楽,ゲーム,DVD,Blu-Ray,CD,コミック" />
		<meta name="description" content="ペンギン好きの一市民・ヒロ†が、本、コミック、映画、音楽、ゲームをレビューして、１００点満点で採点しています。" />
	</c:otherwise>
</c:choose>
<script type="text/javascript">
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-9363480-6']);
  _gaq.push(['_trackPageview']);

  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
</script>
<script type="text/javascript" src="/lib/jquery.js"></script>
<script type="text/javascript">
function setListControl(ulClass) {
	$(ulClass).each(function(){
		var product;
		if($(this).hasClass('Book')) {
			product = 'Book';
		} else if ($(this).hasClass('Music')) {
			product = 'Music';
		} else if ($(this).hasClass('Game')) {
			product = 'Game';
		} else if ($(this).hasClass('Visual')) {
			product = 'Visual';
		} else {
			return;
		}
		$(this).hover(function(){
			$(this).addClass('selected' + product);
		},function(){
			$(this).removeClass('selected' + product);
		});
	});
	$(ulClass).click(function(){
		var href = $("a", this).attr("href");
		location.href= href;
	});
}
</script>
<c:if test="${isMobile}">
<meta name="viewport" content="initial-scale=1.0">
</c:if>
</head>
<body>

<div id="head">
	<jsp:include page="header.jsp" />
</div>
<div id="outer">
	<div id="sidebar">
		<c:if test="${empty sidebarCache}">
			<c:set var="sidebarCache" scope="request">
				<jsp:include page="sidebar.jsp" />
			</c:set>
		</c:if>
		${sidebarCache}
	</div>
	<div id="contents">
		<div id="breadcrumb">
			<nav>
			<a href="/">Top</a>
			<c:if test="${! empty item}">
				&gt; ${item.reviewTitle }
			</c:if>
			<c:if test="${! empty rating}">
				&gt; <span class="star"><span class="star${rating}"></span></span> (新着順)
			</c:if>
			<c:if test="${! empty beginDate}">
				<c:if test="${range == 1}">
					&gt; <fmt:formatDate value="${beginDate}" pattern="yyyy/M" timeZone="JST"/> (新着順)
				</c:if>
				<c:if test="${range == 12}">
					&gt; <fmt:formatDate value="${beginDate}" pattern="yyyy" timeZone="JST"/> (新着順)
				</c:if>
			</c:if>
			<c:if test="${! empty year}">
				&gt; 直近1年間のランキング
			</c:if>
			<c:if test="${! empty search}">
				&gt; サイト内検索
			</c:if>
			<c:if test="${! empty all}">
				&gt; 点数順（全期間）
			</c:if>
			<c:if test="${empty rating && empty item && empty beginDate && empty year && empty search && reviewList != null && empty all}">
				&gt; 新着順
			</c:if>
			<c:if test="${reviewList != null and totalCount > 0}">
				: ${beginRange + 1}件目
				<c:if test="${beginRange + 1 != endRange}">
				 - ${endRange}件目
				</c:if>
				(全${totalCount}件)
			</c:if>
			</nav>
			<c:if test="${! isMobile && empty search}">
			<div id="search" style="float:right;">
				<div id="cse-search-form" style="width: 300px;">Loading</div>
			</div>
			</c:if>
		</div>
<c:if test="${isMobile }">
<div style="width:320px; hegith:50px; margin:0 auto;">
<script type="text/javascript"><!--
google_ad_client = "ca-pub-2855357403949640";
/* for Mobile */
google_ad_slot = "7833433879";
google_ad_width = 320;
google_ad_height = 50;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
</c:if>
		<c:if test="${empty item && reviewList == null && empty search}">
			<div id="top">
				<jsp:include page="top.jsp" />
			</div>
		</c:if>
		<c:if test="${! empty item}">
			<div id="review">
				<jsp:include page="review.jsp" />
			</div>
		</c:if>
		<c:if test="${reviewList != null}">
			<div id="review">
				<jsp:include page="list.jsp" />
			</div>
		</c:if>
		<c:if test="${! empty search}">
<div id="cse" style="width: 100%;">Loading</div>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript"> 
  google.load('search', '1', {language : 'ja', style : google.loader.themes.V2_DEFAULT});
  google.setOnLoadCallback(function() {
    var customSearchOptions = {};  var customSearchControl = new google.search.CustomSearchControl(
      '005413105754885004694:clmtq-usymc', customSearchOptions);
    customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
    customSearchControl.setLinkTarget(google.search.Search.LINK_TARGET_SELF);
    customSearchControl.draw('cse');
    function parseParamsFromUrl() {
      var params = {};
      var parts = window.location.search.substr(1).split('\x26');
      for (var i = 0; i < parts.length; i++) {
        var keyValuePair = parts[i].split('=');
        var key = decodeURIComponent(keyValuePair[0]);
        params[key] = keyValuePair[1] ?
            decodeURIComponent(keyValuePair[1].replace(/\+/g, ' ')) :
            keyValuePair[1];
      }
      return params;
    }

    var urlParams = parseParamsFromUrl();
    var queryParamName = "q";
    if (urlParams[queryParamName]) {
      customSearchControl.execute(urlParams[queryParamName]);
    }
  }, true);
</script>
 		</c:if>
	</div>
</div>
<c:if test="${isMobile}">
<div style="margin:1em auto 0.5em; width: 300px; height: 250px;">
<script type="text/javascript"><!--
google_ad_client = "ca-pub-2855357403949640";
/* 300x250, IT Penguin */
google_ad_slot = "9162065787";
google_ad_width = 300;
google_ad_height = 250;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>
</div>
</c:if>

<jsp:include page="footer.jsp" />
<c:if test="${! isMobile && empty search}">
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript"> 
  google.load('search', '1', {language : 'ja', style : google.loader.themes.V2_DEFAULT});
  google.setOnLoadCallback(function() {
    var customSearchOptions = {};  var customSearchControl = new google.search.CustomSearchControl(
      '005413105754885004694:clmtq-usymc', customSearchOptions);
    customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
    var options = new google.search.DrawOptions();
    options.enableSearchboxOnly("/search");
    customSearchControl.draw('cse-search-form', options);
  }, true);
</script>
</c:if>
</body>
</html>